<template>
    <!-- Control Sidebar -->
    <aside class="control-sidebar control-sidebar-light" style="height:100%;">
        <!-- Create the tabs -->
        <!-- Create the tabs -->
        <ul class="nav nav-tabs nav-justified control-sidebar-tabs">
            <li class="active">
                <a href="#control-sidebar-home-tab" data-toggle="tab"><i class="fa fa-navicon"></i>&nbsp;&nbsp;菜单</a>
            </li>
            <li>
                <a href="#control-sidebar-settings-tab" data-toggle="tab"><i class="fa fa-gears"></i>&nbsp;&nbsp;设置</a>
            </li>
        </ul>
        <!-- Tab panes -->
        <div class="tab-content" style="width:120%;overflow:auto">
            <div class="tab-pane active" id="control-sidebar-home-tab" style="height:100%;width:100%;">
                <!--<h5 class="control-sidebar-heading"></h5>-->
                <ul class="control-sidebar-menu">
                    <li style="border-bottom:1px solid #E8ECF4;">
                        <a href="javascript:;">
                            <img :src="require('_SYS/imgblue/bigdata.png')" width="18px" height="18px" />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<b>大数据分析</b>
                        </a>
                    </li>
                    <li style="border-bottom:1px solid #E8ECF4">
                        <a href="javascript:;">
                            <img :src="require('_SYS/imgblue/GIS.png')" width="18px" height="18px" />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<b>管网GIS</b>
                        </a>
                    </li>
                    <li style="border-bottom:1px solid #E8ECF4">
                        <a href="javascript:;" data-toggle="dropdown" id="sj">
                            <img :src="require('_SYS/imgblue/alarm.png')" width="18px" height="18px" />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<b>生产监控</b>
                        </a>
                        <ul class="dropdown-menu" style="position:relative;top:59%;left:0%;width:90%;height:90px">
                            <li style="border-bottom:1px solid #E8ECF4">
                                <a href="index.html#/monitor/source" style="color:#9D9D9D"><img :src="require('_SYS/imgblue/alarm2.png')" width="18px" height="18px" />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;实时监测报警</a>
                            </li>
                            <li style="border-bottom:1px solid #E8ECF4">
                                <a href="index.html#/control/complex" style="color:#9D9D9D"><img :src="require('_SYS/imgblue/files2.png')" width="18px" height="18px" />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;生产指挥调度</a>
                            </li>
                            <li style="border-bottom:1px solid #E8ECF4">
                                <a href="index.html#/analysis/run" style="color:#9D9D9D"><img :src="require('_SYS/imgblue/sos.png')" width="18px" height="18px" />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;生产运行分析</a>
                            </li>
                        </ul>
                    </li>
                    <li id="logsj" style="display:none">
                        <a></a>
                    </li>
                    <li style="border-bottom:1px solid #E8ECF4">
                        <a href="javascript:;">
                            <img :src="require('_SYS/imgblue/table.png')" width="18px" height="18px" />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<b>生产报表</b>
                        </a>
                    </li>
                    <li style="border-bottom:1px solid #E8ECF4">
                        <a href="javascript:;">
                            <img :src="require('_SYS/imgblue/water.png')" width="18px" height="18px" />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<b>水质管理</b>
                        </a>
                    </li>
                    <li style="border-bottom:1px solid #E8ECF4">
                        <a href="javascript:;">
                            <img :src="require('_SYS/imgblue/equi.png')" width="18px" height="18px" />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<b>设备管理</b>
                        </a>
                    </li>
                    <li style="border-bottom:1px solid #E8ECF4">
                        <a href="javascript:;">
                            <img :src="require('_SYS/imgblue/leader.png')" width="18px" height="18px" />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<b>应急指挥</b>
                        </a>
                    </li>
                    <li style="border-bottom:1px solid #E8ECF4">
                        <a href="javascript:;" data-toggle="dropdown" id="bloa">
                            <img :src="require('_SYS/imgblue/biguser.png')" width="18px" height="18px" />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<b>大用户管理</b>
                        </a>
                        <ul class="dropdown-menu" style="position:relative;top:59%;left:0%;width:90%;height:120px">
                            <li style="border-bottom:1px solid #E8ECF4">
                                <a href="monitorStart.html" style="color:#9D9D9D"><img :src="require('_SYS/imgblue/alarm2.png')" width="18px" height="18px" />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;实时监测及分布</a>
                            </li>
                            <li style="border-bottom:1px solid #E8ECF4">
                                <a href="biguserFile.html" style="color:#9D9D9D"><img :src="require('_SYS/imgblue/files2.png')" width="18px" height="18px" />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;大用户档案管理</a>
                            </li>
                            <li style="border-bottom:1px solid #E8ECF4">
                                <a href="waterAlarm.html" style="color:#9D9D9D"><img :src="require('_SYS/imgblue/sos.png')" width="18px" height="18px" />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;异常报警信息</a>
                            </li>
                            <li style="border-bottom:1px solid #E8ECF4">
                                <a href="historyWater.html" style="color:#9D9D9D"><img :src="require('_SYS/imgblue/table2.png')" width="18px" height="18px" />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;统计及历史查询</a>
                            </li>
                        </ul>
                    </li>
                    <li id="log" style="display:none">
                        <a></a>
                    </li>
                    <li style="border-bottom:1px solid #E8ECF4">
                        <a href="javascript:;">
                            <img :src="require('_SYS/imgblue/fix.png')" width="18px" height="18px" />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<b>报装管理</b>
                        </a>
                    </li>
                    <li style="border-bottom:1px solid #E8ECF4">
                        <a href="javascript:;">
                            <img :src="require('_SYS/imgblue/fix2.png')" width="18px" height="18px" />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<b>报修管理</b>
                        </a>
                    </li>
                    <li style="border-bottom:1px solid #E8ECF4">
                        <a href="javascript:;">
                            <img :src="require('_SYS/imgblue/server.png')" width="18px" height="18px" />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<b>服务热线</b>
                        </a>
                    </li>
                    <li style="border-bottom:1px solid #E8ECF4">
                        <a href="javascript:;">
                            <img :src="require('_SYS/imgblue/safe.png')" width="18px" height="18px" />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<b>安全管理</b>
                        </a>
                    </li>
                    <li style="border-bottom:1px solid #E8ECF4">
                        <a href="javascript:;">
                            <img :src="require('_SYS/imgblue/know.png')" width="18px" height="18px" />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<b>知识管理</b>
                        </a>
                    </li>
                    <li style="border-bottom:1px solid #E8ECF4">
                        <a href="javascript:;">
                            <img :src="require('_SYS/imgblue/files.png')" width="18px" height="18px" />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<b>档案管理</b>
                        </a>
                    </li>
                    <li style="border-bottom:1px solid #E8ECF4">
                        <a href="javascript:;">
                            <img :src="require('_SYS/imgblue/role.png')" width="18px" height="18px" />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<b>系统管理</b>
                        </a>
                    </li>
                </ul>
            </div>
            <!-- /.tab-pane -->
            <!-- Stats tab content -->
            <div class="tab-pane" id="control-sidebar-stats-tab">Stats Tab Content</div>
            <!-- /.tab-pane -->
            <!-- Settings tab content -->
            <div class="tab-pane" id="control-sidebar-settings-tab">
                <h3 class="control-sidebar-heading" style="color:#9D9D9D;font-size:15px;margin-top:30px;margin-bottom:1px;"><img :src="require('_LTE/dist/img/user2-160x160.jpg')" width="25px" height="25px"/>&nbsp;&nbsp;个人信息</h3>
                <div class="form-group" style="width:85%;">
                    <table class="table">
                        <tbody>
                            <tr>
                                <td style="color:#9D9D9D">用户ID：</td>
                                <td style="color:#9D9D9D">1001</td>
                            </tr>
                            <tr>
                                <td style="color:#9D9D9D">用户名：</td>
                                <td style="color:#9D9D9D">张三</td>
                            </tr>
                            <tr>
                                <td style="color:#9D9D9D">所属公司：</td>
                                <td style="color:#9D9D9D">供水公司</td>
                            </tr>
                            <tr>
                                <td style="color:#9D9D9D">职位：</td>
                                <td style="color:#9D9D9D">信息员</td>
                            </tr>
                        </tbody>
                    </table>
                </div>
                <ul class="control-sidebar-menu">
                    <li style="border-bottom:1px solid #E8ECF4;">
                        <a href="javascript:;">
                            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                            <b>修改个人信息</b>
                        </a>
                    </li>
                    <li style="border-bottom:1px solid #E8ECF4;">
                        <a href="javascript:;" @click="logout">
                            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                            <b>注销</b>
                        </a>
                    </li>
                </ul>
            </div>
            <!-- /.tab-pane -->
        </div>
    </aside>
</template>
<script>
    export default {
        data() {
            return {}
        },
        methods: {
            logout () {
                if(confirm('确定注销?')) {
                    const _this = this;
                    this.$store.dispatch('logout', {
                        callback () {
                        
                            _this.$router.push({
                                path: '/login',
                                query: {
                                    redirectUrl: location.href
                                }
                            });
                        }
                    })
                }
            }
        }
    };
</script>